<template>
  <view class="login-bg">
    <view class="logo-wrap">
      <!-- <image class="logo-img" src="https://img.yzcdn.cn/vant/weapp/logo.png" mode="aspectFit" /> -->
	   <up-icon name="weixin-fill" color="#07c160" size="40"></up-icon>
    </view>
    <view class="app-title">行业资讯小程序</view>
    <view class="app-desc">微信快捷登录，安全便捷</view>

    <button class="login-btn" open-type="getPhoneNumber" v-if="checked" @getphonenumber="onGetPhone">
      <up-icon name="phone-fill" color="#fff" size="32" />
      <view  style="margin-left:32rpx;" >一键获取手机号登录</view>
    </button>
    <button class="login-btn"  v-else @click="onGetPhone">
      <up-icon name="phone-fill" color="#fff" size="32" />
      <view  style="margin-left:32rpx;" >一键获取手机号登录</view>
    </button>

    <view class="agree-row">
      <!-- <checkbox v-model="checked" color="#3a7afe" /> -->
	  <up-checkbox
			:customStyle="{marginBottom: '0',marginTop: '0'}"
			label=""
			name="agree"
			usedAlone
			activeColor="#07c160"
			v-model:checked="checked"
		>
		</up-checkbox>
      <text class="agree-text">
        登录即表示同意
        <text class="link" @click="toAgreement(0)">《用户服务协议》</text>
        和
        <text class="link" @click="toAgreement(1)">《隐私政策》</text>
      </text>
    </view>

    <view class="footer-tip">
      登录代表你已阅读并同意相关条款
    </view>
    <view class="footer-copyright">
      © 2025 行业资讯 版权所有
    </view>
  </view>
</template>

<script setup>
import { ref } from 'vue'
import { login } from '@/api/login'
const checked = ref(false)

const onGetPhone = (e) => {
  if (!checked.value) {
    uni.showToast({ title: '请先同意协议', icon: 'none' })
    return
  }
  uni.login({
      provider: 'weixin', //使用微信登录  
      success: function (loginRes) {
        let code = loginRes.code
        if(code&&e.detail.code){
          login({code:code,code1:e.detail.code}).then(async(res)=>{
            if(res.code==200){
              console.log(res);
              uni.setStorageSync('token',res.token)
              uni.setStorageSync('userInfo',res.user)
              // 判断是否第一次登录
              if(!uni.getStorageSync('firstLogin')){
                uni.setStorageSync('firstLogin',0)
              }
              uni.switchTab({url:'/pages/mine/index'})
            }else{
              uni.showToast({
                title: res.msg,
                icon: 'none'
              })
            }
          })
        }
      }
  });
}

const toAgreement=(type)=>{
  uni.navigateTo({
    url: '/pages/mine/agreement?type='+type
  })
}
</script>

<style scoped>
.login-bg {
  min-height: 100vh;
  background: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 120rpx;
  box-sizing: border-box;
}
.logo-wrap {
  width: 180rpx;
  height: 180rpx;
  background: #e1f5eb;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 48rpx;
}
.logo-img {
  width: 120rpx;
  height: 120rpx;
}
.app-title {
  font-size: 40rpx;
  font-weight: bold;
  color: #222;
  margin-bottom: 18rpx;
  text-align: center;
}
.app-desc {
  font-size: 28rpx;
  color: #888;
  margin-bottom: 80rpx;
  text-align: center;
}
.login-btn {
  width: 90%;
  background: #07c160;
  color: #fff;
  font-size: 32rpx;
  font-weight: bold;
  border-radius: 18rpx;
  padding: 14rpx 0;
  margin: 0 auto 48rpx auto;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  box-shadow: 0 4rpx 24rpx 0 rgba(24,195,125,0.08);
}
.agree-row {
  display: flex;
  align-items: center;
  margin-bottom: 24rpx;
  width: 90%;
}
.agree-text {
  font-size: 26rpx;
  color: #222;
  margin-left: 12rpx;
}
.link {
  color: #18c37d;
  text-decoration: underline;
  margin: 0 4rpx;
}
.footer-tip {
  font-size: 24rpx;
  color: #888;
  margin-top: 260rpx;
  text-align: center;
}
.footer-copyright {
  font-size: 24rpx;
  color: #b0b3bb;
  margin-top: 12rpx;
  text-align: center;
}
</style>